// import React, { Component } from 'react'
// import { Space, Button } from 'antd'
// import CustomTable from './components/CustomTable'
// import { getList } from '../../api/health'


// export default class Health extends Component {

//   state = {
//     healthList: [],
//     page: 1,
//     pageSize: 5,
//     total: 0
//   }

//   // 组件挂载后立即调用，发送 ajax 请求数据
//   componentDidMount() {
//     getList({
//       pageSize: this.state.pageSize
//     })
//       .then(res => {
//         this.setState({
//           healthList: res.list,
//           page: res.page,
//           pageSize: res.pageSize,
//           total: res.total
//         })
//       })
//   }
  
//   handlePageChange = (_page, _pageSize) => {
//     getList(_page, _pageSize)
//   }
//   render() {
//     return (
//       <div>
//         <Space>
//           <Button type="primary">添加</Button>
//           <Button>导出</Button>
//         </Space>
//         <CustomTable
//           dataSource={this.state.healthList}
//           page={this.state.page}
//           pageSize={this.state.pageSize}
//           total={this.state.total}
//         onChange={this.handlePageChange}
//         />
//       </div>
//     )
//   }
// }

import React, { useState, useEffect } from 'react'
import {  Button, Form, Input } from 'antd'
import CustomTable from './components/CustomTable'
import { getList,getClasz } from '../../api/health'

export default function Health() {


  // 利用 useState HOOK 定义组件使用到的 state 状态数据
  const [healthList, setHealthList] = useState([])
  const [clasz, setClasz] = useState("")
  const [aname, setAname] = useState("")
  const [astuNo, setAstuNo] = useState()
  const [page, setPage] = useState(1)
  const [pageSize, setPageSize] = useState(5)
  const [total, setTotal] = useState(0)

  useEffect(() => {
    getListByPage()
  }, [])

  const handleGetInputValue1 = (event) => {
    setAname(event.target.value)
    }
    const handleGetInputValue2 = (event) => {
      setAstuNo(event.target.value)
      }
      const handleGetInputValue3 = (event) => {
        setClasz(event.target.value)
        }
    
   async function getListByPage(_page = 1, _pageSize = 5) {
    try {
      // res 中保存了 Promise 处理成功后的数据
      const res = await getList({
        page: _page,
        pageSize: _pageSize
      })
      // 设置状态数据
      setHealthList(res.list)
      setPage(res.page)
      setPageSize(res.pageSize)
      setTotal(res.total)
    } catch (error) {
      console.log('异常：', error)
    }
  }
   
 
  async function getListByClasz(_page = 1, _pageSize = 5) {
    console.log('clasz班级',clasz)
    try {
      // res 中保存了 Promise 处理成功后的数据
      const res = await getClasz({
        clasz,
        page: _page,
        pageSize: _pageSize,
        aname,
        astuNo,
      })
      // 设置状态数据
      setHealthList(res.list)
      setPage(res.page)
      setPageSize(res.pageSize)
      setTotal(res.total)
      setClasz(clasz)

    } catch (error) {
      console.log('异常：', error)
    }
  }

  async function getListByClasz1() {
    console.log('clasz班级',clasz)
    try {
      // res 中保存了 Promise 处理成功后的数据
      const res = await getClasz({
        clasz,
        page,
        pageSize,
        aname,
        astuNo,
      })
      // 设置状态数据
      setHealthList(res.list)
      setPage(res.page)
      setPageSize(res.pageSize)
      setTotal(res.total)
      setClasz(clasz)

    } catch (error) {
      console.log('异常：', error)
    }
  }

  const judge = (_page, _pageSize) => {
    if(!clasz&&!aname&&!astuNo) {
      getListByPage(_page, _pageSize)
    }else {
    getListByClasz(_page, _pageSize)
  }
}
  // 页码改变，重新查询数据
  const handlePageChange = (_page, _pageSize) => {
    judge(_page, _pageSize)
  }
  
  const onFinish = (values) => {
    console.log('Received values of form: ', values);
  }
 
  return (
    <div>
      <Form name="sousuo" layout="inline" onFinish={onFinish}>
        <Form.Item name="aname">
          <Input placeholder="请输入搜索姓名" value={aname}  onChange={handleGetInputValue1}/>
        </Form.Item>
        <Form.Item name="astuNo">
          <Input placeholder="请输入学号" value={astuNo}  onChange={handleGetInputValue2}/>
        </Form.Item>
        <Form.Item name="clasz">
          <Input placeholder="请输入班级" value={clasz}  onChange={handleGetInputValue3}/>
        </Form.Item>
        <Form.Item>
          <Button type="primary" onClick={getListByClasz1}>搜索</Button>
        </Form.Item>
      </Form>
      <CustomTable
        dataSource={healthList}
        page={page}
        pageSize={pageSize}
        total={total}
        onChange={handlePageChange}
      />
    </div>
  )
}